<!DOCTYPE html>
<html>

<head>

    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">


    <title> 款式页面</title>
    <meta name="keywords" content="">
    <meta name="description" content="">

    <link rel="shortcut icon" href="favicon.ico"> 
	<link href="css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
    <link href="css/font-awesome.css?v=4.4.0" rel="stylesheet">
	<link href="css/plugins/iCheck/custom.css" rel="stylesheet">
    <!-- jqgrid-->
    <link href="css/plugins/jqgrid/ui.jqgrid.css?0820" rel="stylesheet">

    <link href="css/animate.css" rel="stylesheet">
    <link href="css/style.css?v=4.1.0" rel="stylesheet">

    <style>
        /* Additional style to fix warning dialog position */

        #alertmod_table_list_2 {
            top: 900px !important;
        }
    </style>

</head>

<body class="gray-bg">
	<div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
				<div class="ibox float-e-margins">
<!--
					新增模块	
					<div class="col-md-12">
    					<div class="form-group">
       						 <h5>款名查询框:</h5>
							<form action="" method="post">
							<input type="text" name="" placeholder="请输款名" />
        					<button class="btn btn-primary" type="submit">查询</button>
							</form>
   						 </div>
					</div>
-->
					<div class="ibox-content">
						<form id="form1" method="post" class="form-horizontal" onsubmit="return false" action="##">
							<div class="form-group">
                                <label class="col-sm-2 control-label">款名查询框:</label>

                                <div class="col-sm-10">
                                    <div class="input-group">
                                        <input name="stylename" id="stylename" type="text" placeholder="请输款名" class="form-control" > <span class="input-group-btn">
										<button type="button" class="btn btn-primary" onclick="selectObj()">搜索
                                        </button> </span>
                                    </div>
                                </div>
                            </div>
						</form>
					</div>
				</div>
			</div>
		</div>
	</div>
		
    <div class="wrapper wrapper-content  animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox ">
                    <div class="ibox-title">
                        <h5>数据库已有款式</h5>
                    </div>
                    <div class="ibox-content">
                       
<!--                        <h4>基本示例</h4>-->
						<!--		模糊查询的模块	-->
					<div class="col-md-12">
    					<div class="form-group">
        					<div class="col-sm-12 col-sm-offset-3">
           						<button type="button" class="btn btn-w-m btn-success" onclick="location='addStyle.html'">新增</button>
       						 </div>
    					</div>
					</div>
						<!-- 表格模块 -->
                        <div class="jqGrid_wrapper">
                            <table id="table_list_1"></table>
                            <div id="pager_list_1"></div>
                        </div>
                        <p>&nbsp;</p>
<!--
                        <h4 class="m-t">高级用法</h4>


                        <div class="jqGrid_wrapper">
                            <table id="table_list_2"></table>
                            <div id="pager_list_2"></div>
                        </div>
-->
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- 全局js -->
    <script src="js/jquery.min.js?v=2.1.4"></script>
    <script src="js/bootstrap.min.js?v=3.3.6"></script>



    <!-- Peity -->
    <script src="js/plugins/peity/jquery.peity.min.js"></script>

    <!-- jqGrid -->
    <script src="js/plugins/jqgrid/i18n/grid.locale-cn.js?0820"></script>
    <script src="js/plugins/jqgrid/jquery.jqGrid.min.js?0820"></script>

    <!-- 自定义js -->
    <script src="js/content.js?v=1.0.0"></script>


    <!-- Page-Level Scripts -->
    <script>
		
		
		function selectObj() {
			var stylename = $("#stylename").val();
			var styleVO={
				stylename:stylename
			};
            $("#table_list_1").jqGrid('setGridParam',{ 
                url:"http://localhost:8081/lecture/selectStyleByName", 
				datatype: "JSON",
				mtype:"POST",
				ajaxGridOptions: { contentType: 'application/json; charset=utf-8' },
                postData:JSON.stringify(styleVO), //发送数据 
				jsonReader : {
					root:"data"//从json数据中的data里读取集合,默认rows
				},
            }).trigger("reloadGrid"); //重新载入 
		};
		
		//删除超链接
		function sc(cellValue, options, rowdata, action)
    {
        return "<a href='javascript:deleLink(\""+rowdata.id+"\");'>"+rowdata.sc+"</a>";
    };
		
		function deleLink(id)
    {
		if (confirm("数据即将删除，确定继续吗？")){
			var style={
				id:id,
				flag:0
			};
			console.log(style);
			$.ajax({
            //几个参数需要注意一下
                type: "POST",//方法类型
                dataType: "json",//预期服务器返回的数据类型
                url: "http://localhost:8081/lecture/updateStyle" ,//url
                data: JSON.stringify(style),
				contentType: "application/json;charset=UTF-8",
                success: function (rsp) {
                   	console.log(rsp);
					if(rsp.respCode==="0"){
						alert("删除成功");
						window.location.href="tableKS.html";
						
					}else{
						alert(rsp.respDesc);
						
					}
					
					
				},
				error:function(){
					 window.location.href="500.html";
					
				}
            });
			return false;
		}
    };
		
        $(document).ready(function () {
//			
			var mydata = [
//                {
//                    id: "1",
//                    styleID: "3120604841",
//                    styleName: "绣花长袖中羽绒服",
//                    standard: "M",
//                    price: "530.00",
//					flag:"可用",
//                    operator: "root",
//					createtime: "2007-09-01",
//					xq:"详情",
//					bj: "编辑",
//					sc: "删除"
//                }
            ];
			Date.prototype.Format = function (fmt) {
			var o = {
				"M+": this.getMonth() + 1, //月份 
				"d+": this.getDate(), //日 
				"h+": this.getHours(), //小时 
				"m+": this.getMinutes(), //分 
				"s+": this.getSeconds(), //秒 
				"q+": Math.floor((this.getMonth() + 3) / 3), //季度 
				"S": this.getMilliseconds() //毫秒 
			};
			if (/(y+)/.test(fmt)) fmt = fmt.replace(RegExp.$1, (this.getFullYear() + "").substr(4 - RegExp.$1.length));
			for (var k in o)
			if (new RegExp("(" + k + ")").test(fmt)) fmt = fmt.replace(RegExp.$1, (RegExp.$1.length == 1) ? (o[k]) : (("00" + o[k]).substr(("" + o[k]).length)));
			return fmt;
		};

			$.ajax({
    			url: "http://localhost:8081/lecture/selectStyleListByFlag",
    			type: "GET",
    			timeout: 5000,
    			async: true,
    			data: null,
    			dataType: "json",
    			error: function(XMLHttpRequest, textStatus, errorThrown) {
    				
    			},
    			success: function(rsp, textStatus) {
					console.log(rsp.data[0].id);
					this.mydata=rsp.data;
					console.log(this.mydata);
					var obj = eval(this.mydata);

					
			$.jgrid.defaults.styleUI = 'Bootstrap';
            // Examle data for jqGrid
            // Configuration for jqGrid Example 1
            $("#table_list_1").jqGrid({
                data: this.mydata,
                datatype: "local",
				mtype:"GET",
                height: 250,
                autowidth: true,
                shrinkToFit: true,
                rowNum: 10,
                rowList: [10, 20, 30],
                colNames: ['序号','款号' ,'款式内部编号' ,'款名', '规格', '零售价','操作人','创建时间','','',''],
                colModel: [
                    {
						
                        name: 'id',
                        index: 'id',
                        width: 70,
						align: "center",
//                        sorttype: "Long"
                    },
                    {
                        name: 'styleid',
                        index: 'styleid',
                        width: 60,
						align: "center",
//                        sorttype: "int"
                    },
					{
                        name: 'numstr',
                        index: 'numstr',
                        width: 70,
						align: "center",
//                        sorttype: "int"
                    },
                    {
                        name: 'stylename',
                        index: 'stylename',
						align: "center",
                        width: 100
                    },
                    {
                        name: 'standard',
                        index: 'standard',
						align: "center",
                        width: 50
                    },
                    {
                        name: 'price',
                        index: 'price',
                        width: 60,
                        align: "center",
//                        sorttype: "float",
                        formatter: "number"
                    },
                    {
                        name: 'operator',
                        index: 'operator',
						align: "center",
                        width: 50
                        
                    },
                    {
						name: 'createtime',
                        index: 'createtime',
						align: "center",
                        width: 65,
                        sorttype: "date",
						formatter:function(value,options,row){ 
							return new Date(value).Format('yyyy-MM-dd hh:mm:ss');}
					
                    },
					{
                        name: 'xq',
						index:'xq',
                        formatter:'showlink', 
						formatoptions:{baseLinkUrl:'styleXQ.html'},
//						formatter:xqLink,
						align: "center",
                        width: 20
                        
                    },
					{
                        name: 'bj',
						index:'bj',
                        formatter:'showlink', 
						formatoptions:{baseLinkUrl:'updateStyle.html'},
//						formatter:bjLink,
						align: "center",
                        width: 20
                        
                    },
					{
                        name: 'sc',
						index:'sc',
                        formatter:'showlink', 
//						formatoptions:{baseLinkUrl:'http://localhost:8081/lecture/deleteByPrimaryKey'},
						formatter:sc,
						align: "center",
                        width: 20
                        
                    }
                ],
                pager: "#pager_list_1",
                viewrecords: true,
                caption: "款式列表",
                hidegrid: false
            });
					
			
					
    			}//success
				
    		});
				

            // Add responsive to jqGrid
            $(window).bind('resize', function () {
                var width = $('.jqGrid_wrapper').width();
                $('#table_list_1').setGridWidth(width);
            });
        });
    </script>

    
    

</body>

</html>
